const img = 'https://www.iiscchina.com/wp-content/uploads/2024/07/dqwz.png';
//公共方法
import methodBase from '@/config/base.js';

export default {
	data() {
		return {
			mylatitude: 0,
			mylongitude: 0,
			mapKey: 0,
			circles: [],
			markers: [],
			scale: 17, // 缩放级别，取值范围为3-20
			ifshow: false,
			ifreach: true,
			ifmatch: true,
			nowpoint: 0, //当前点位
			endtime:'2024-09-29 23:23:10',
			downtime:'加载中...',
			interval:{},
		}
	},
	onReady() {
		var that = this;
		uni.startLocationUpdate({
			success: res => {
				uni.onLocationChange(function(ress) {
					console.log("111-111");
					that.mylatitude = ress.latitude;
					that.mylongitude = ress.longitude;
					// that.moveTolocations();
					that.mapKey++;
				});
			},
			fail: err => console.error('开启应用接收位置消息失败：', err),
			complete: msg => console.log('调用开启应用接收位置消息 API 完成')
		});
		// 每秒更新倒计时
		that.interval = setInterval(function() {
		  that.downtime=methodBase.updateCountdown(that.endtime)
		}, 1000);
		// that._mapContext = uni.createMapContext("map", that);
		// that._mapContext.initMarkerCluster({
		// 	enableDefaultStyle: false,
		// 	zoomOnClick: true,
		// 	gridSize: 60,
		// 	complete(res) {
		// 		console.log('initMarkerCluster', res)
		// 	}
		// });
		// that._mapContext.on("markerClusterCreate", (e) => {
		// 	console.log("markerClusterCreate", e);
		// });

		that.addMarkers();
	},
	methods: {
		tapCallout(e) {
			console.log('tapCallout:', e.detail.markerId);
		},
		ifmatchs() {
			var that = this;
			if (that.ifmatch) {
				that.ifmatch = false;
			} else {
				that.ifmatch = true;
			}
		},
		ifreachs() {
			var that = this;
			if (that.ifreach) {
				that.ifreach = false;
			} else {
				that.ifreach = true;
			}
		},
		viewtask() {
			uni.reLaunch({
				url: '/pages/index/viewtask'
			})
		},
		// moveTolocations() {
		// 	var that=this;
		// 	let mapObjs = uni.createMapContext('map', that)
		// 	mapObjs.moveToLocation({
		// 		latitude: that.mylatitude,
		// 		longitude: that.mylongitude,
		// 		complete: res => {
		// 			console.log('移动完成:', res)
		// 		}
		// 	})
		// },
		markertap(e) {
			console.log(e);
			var that = this;
			var markerId = e.detail.markerId;
			if (markerId) {
				that.nowpoint = markerId;
				that.ifshow = true;
				that.ifreach = true;
				that.ifmatch = true;

				var pointList = that.markers;
				console.log(pointList)
				//‘BYCLICK’:点击显示; ‘ALWAYS’:常显
				var b = pointList.forEach((item) => {
					if (item.id == markerId) { //找到对应id
						if (item.callout.display == '') {
							item.callout.display = 'ALWAYS';
							return;
						} else if (item.callout.display == 'ALWAYS') {
							item.callout.display = '';
							return;
						}
					}
				})
			}
		},
		addMarkers() {
			var that = this;
			const positions = [{
				latitude: 30.5702,
				longitude: 104.06676,
			}, {
				latitude: 30.5702,
				longitude: 104.07676,
			}, {
				latitude: 30.5802,
				longitude: 104.06676,
			}, {
				latitude: 30.5802,
				longitude: 104.07676,
			}]

			positions.forEach((item,key) => {
				var make_tmp =[];
				var circles_tmp =[];
				console.log(item);
				console.log(key);
				var latitude_tmp = item.latitude;
				var longitude_tmp = item.longitude;
				var make_tmp = {
					id: key + 1,
					latitude: latitude_tmp,
					longitude: longitude_tmp,
					iconPath: img,
					width: 30,
					title: '点击我',
					height: 30,
					joinCluster: true, // 指定了该参数才会参与聚合11
					callout: {
						content: '四川省成都市武侯区桂溪街道天仁北二街', //文本
						color: '#000000', //文字颜色
						fontsize: 14, //文本大小
						borderColor: '#ffffff',
						borderRadius: 5,
						padding: 10,
						display: '',
					},
				};
				var circles_tmp = {
					latitude: latitude_tmp,
					longitude: longitude_tmp,
					color: '#999', // 描边的颜色
					fillColor: '#8cc4fc', // 填充颜色
					radius: 100, // 圆半径，单位米
					strokeWidth: 1, // 描边的宽度
				}
				// expected output: 42
				// expected output: 13
				that.markers.push(make_tmp);
				that.circles.push(circles_tmp);
			})
			console.log(that.markers)
			console.log(that.circles)

			// positions.forEach((p, i) => {
			// 	markers.push(
			// 			id: i + 1,
			// 			longitude:i.
			// 			iconPath: img,
			// 			width: 30,
			// 			title:'点击我',
			// 			height: 30,
			// 			joinCluster: true, // 指定了该参数才会参与聚合11
			// 			callout: {
			// 				content: '德隆大厦', //文本
			// 				color: '#ffffff', //文字颜色
			// 				fontsize: 14, //文本大小
			// 				display: '',
			// 			},
			// 			// label:{
			// 			// 	content:'德隆大厦',//文本
			// 			//     color:'#ffffff',//文字颜色
			// 			// 	fontsize:14,//文本大小
			// 			// },
			// 		}, p)
			// 	)
			// 	circles.push(
			// 		Object.assign({}, {
			// 			color: '#999', // 描边的颜色
			// 			fillColor: '#8cc4fc', // 填充颜色
			// 			radius: 100, // 圆半径，单位米
			// 			strokeWidth: 1, // 描边的宽度
			// 			callout: {
			// 				content: '德隆大厦', //文本
			// 				color: '#ffffff', //文字颜色
			// 				fontsize: 14, //文本大小
			// 				display: '',
			// 			},
			// 		}, p)
			// 	)
			// })
			// console.log(markers)
			// that._mapContext.addMarkers({
			// 	markers,
			// 	clear: false,
			// 	complete(res) {
			// 		console.log('addMarkers', res)
			// 	}
			// })
			// that.circles = circles;

		}
	},
	// 在页面的 onUnload 生命周期中停止更新位置
	onUnload() {
		var that=this;
		uni.stopLocationUpdate({
			success() {
				console.log('位置更新停止成功');
			},
			fail(err) {
				console.log('位置更新停止失败：', err);
			}
		});
		//清除定时器
		clearInterval(that.interval);
	},
	onLaunch() {

	},
	onShow() {
		var that = this;
		uni.getLocation({
			type: 'wgs84',
			success: function(res) {
				console.log('当前位置的经度：' + res.longitude);
				console.log('当前位置的纬度：' + res.latitude);
				that.mylatitude = res.latitude;
				that.mylongitude = res.longitude;
			}
		});
	},
	onLoad() {

	},

	onPageScroll: function(e) {
		// console.log("滚动距离为：" + e.scrollTop);
	},
	onReachBottom: function(e) {
		console.log("触发底部");
	},

}